<template>
	<view class="ball-team-page">
		<view class="select-area-sty">
			<view style="flex:1;text-align: left;margin-left: 30rpx;">

				<uni-data-select :localdata="selBallTeamList" v-model="ballTeamNm" :clear="false" @change="changeLog" />
			</view>
			<view style="flex:1;text-align: center;">
				级别
				<uni-data-select v-model="lv" :localdata="level" @change="changeLevel"></uni-data-select>
			</view>
		</view>
		<view style="padding: 32rpx;">
			<view v-for="item in ballTeamList" :key="item._id" class="ball-team-area" @click="toNewsDetail(item)">
				<view style="width: 120rpx;height: 62px;display: inline-block;vertical-align: top;"><img
						style="width: 100%;height: 62px;" :src="item.imgUrl" alt=""></view>
				<view style="display: inline-block;margin-left: 20rpx;position: relative;width: 68%;height: 62px;">
					<view class="text-title">{{item.teamName}}</view>
					<view class="text-sty">{{item.ballTeamIntroduce}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getDataFn
	} from '@/utils/baseFn.js';
	const db = uniCloud.database();
	const dbCmd = db.command;
	export default {
		data() {
			return {
				newsList: [],
				where: `"deleted_at"==null`,
				level: [{
						value: '0',
						text: '公开组'
					},
					{
						value: '1',
						text: '职工组'
					},
					{
						value: '',
						text: '所以组别'
					}
				],
				ballTeamList: [],
				selBallTeamList: [],
				ballTmeamWhere: `"deleted_at"==null&&"state"==1`,
				tmpWhere: {
					deleted_at: null,
					state: 1
				},
				lv: '',
				ballTeamNm: '',
				skipNum: 0
			}
		},
		created() {
			this.getBallTeamList(0)
		},
		mounted() {},
		methods: {
			getBallTeamList(fla = 1) {
				const _this  = this
				getDataFn('team-MGMT', this.ballTmeamWhere, this.skipNum,
						'teamName,type,logo,state,ballTeamIntroduce')
					.then(res => {
						const arr = []
						const selArr = []
						res.data.map(item => {
							const file = item.logo.split(',')
							item.imgUrl = `${this.$baseImgUrl}${file[0]}`
							arr.push(item)
							selArr.push({
								value: item._id,
								text: item.teamName
							})
						})
						selArr.push({
							value: '',
							text: '全部'
						})
						_this.ballTeamList = _this.ballTeamList.concat(arr)
						_this.skipNum = _this.ballTeamList.length
						if (fla == 0) {
							_this.selBallTeamList = selArr
						}
					})
			},
			toNewsDetail(item) {
				uni.navigateTo({
					url: `ballTeamDetail?id=${item._id}`
				});
			},
			initData() {
				this.ballTeamList = []
				this.skipNum = 0
				this.getBallTeamList()
			},
			changeLevel(e) {
				let str = {
					...this.tmpWhere
				}
				if (e) {
					str.type = e
				}
				if (this.ballTeamNm) {
					str._id = this.ballTeamNm
				}
				this.ballTmeamWhere = str
				this.initData()
			},
			changeLog(e) {
				let str = {
					...this.tmpWhere
				}
				if (e) {
					str._id = e
					// str.raceTime = new RegExp(e.trim())
				}
				if (this.lv) {
					str.type = this.lv
				}
				this.ballTmeamWhere = str
				this.initData()
			}
		},
		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {
			// this.skipNum = this.skipNum + 20
			this.getBallTeamList()
		},
	}
</script>

<style>
	.ball-team-page {}

	.select-area-sty {
		height: 55px;
		display: flex;
		background-color: #fff;
		line-height: 50px;
	}

	.ball-team-page .uni-select,
	.ball-team-page .uni-date-x--border {
		border: none;
		border-bottom: none;
	}

	.ball-team-page .uni-stat__select {
		width: 120px;
		display: inline-block;
	}

	.text-sty {
		font-size: 12px;
		/* height: 30px; */
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-line-clamp: 2;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		margin-top: 12px;
	}

	.ball-team-area {
		margin-bottom: 30px;
	}

	.text-title {
		font-size: 15px;
		font-family: 600;
		width: 70%;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
</style>
<style lang="scss">
</style>